<template>
	<view>
		<!-- 没有数据时的页面 -->
    <view class="emptyPage" v-if='cart.length==0'>
 <image  src="@/static/cart_empty@2x.png" mode=""></image>
 <text>空空如也~</text>
    </view>
    <view class="" v-else>
      <!-- 收获地址 -->
            <my-address></my-address>
      <view class="title_box">
        <!-- title区域 -->
        <uni-icons type="shop"></uni-icons>
        <text>购物车</text>
      </view>
      <uni-swipe-action>
        <block  v-for="(item,i) in cart" :key='i'>
        <uni-swipe-action-item :options="options" @click="deleGoods(item.goods_id)">
          <my-goods :showAdder='true' :isShow='true' @change_number='getChangeNumber'  @click='toggleCheck' :item='item'></my-goods>
        </uni-swipe-action-item>
        </block>
      </uni-swipe-action>
     <view class="address_box">
        <my-settle @toggleAll='toggle_all' @click='toggle'></my-settle>
     </view>
    </view>
	</view>
</template>

<script>
  import {mapState,mapGetters,mapMutations} from 'vuex'
	export default {
		data() {
			return {
        addressData:'',
				carsList:[],
        checks:true,
         options:[
                {
                    text: '删除',
                    style: {
                        backgroundColor: '#c00000'
                    }
                }
              ]
			};
		},
    computed:{
      ...mapState('m_cart',['cart','total']),
     
        // ...mapGetters('m_cart',['total'])
    },
 watch:{
   total:{
     handler(){
       this.showTotal()
     },
     immediate:true
   }
 },
    onShow(){
      this.showTotal()
    },
    methods:{
      toggle_all(flag){
        console.log('触发了')
       this.cart.map(x=>x.goods_state=flag)
      },
       ...mapMutations('m_cart',['saveCart','delCart']),
      getChangeNumber(e){
        const goods= this.cart.find(x=>x.goods_id==e.goods_id)
        console.log('查找', goods )
        goods.goods_count=e.goods_count
          this.$store._mutations['m_cart/total1'][0]()
          // this.saveCart()
      },
      toggleCheck(ids){
        console.log('')
       const goods= this.cart.find(x=>x.goods_id==ids)
       goods.goods_state=! goods.goods_state
             this.$store._mutations['m_cart/total1'][0]()
      },
    showTotal(){
    if(this.total!==0){
      console.log('aaaaa',this.total)
      uni.setTabBarBadge({
        text:this.total+'',
        index:2
      })
    }
      },
      deleGoods(ids){
        this.delCart(ids)
        console.log('jjjj',ids)
      },
    
    },
    onLoad(){
      this.$store._mutations['m_cart/total1'][0]()
    }
	}
</script>

<style lang="scss">
  .address_box{
    position: sticky;
    bottom: 0;
  }
 .emptyPage{
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   height: 750rpx;
   image{
     width: 200rpx;
     height: 200rpx;
   }
   text{
     padding-top: 20px;
     text-align: center;
     color: gray;
     font-size: 12px;
   }
 }
.title_box{
  display: flex;
  justify-content: start;
  padding: 5px;
  uni-icons{
    margin-right: 5px;
  }
}
</style>
